﻿<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <title>Ain Blog Backstage</title>
    <link th:href="@{/static/backstage/css/bootstrapmb.com.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/static/backstage/font/iconfont.css}" rel="stylesheet" type="text/css">
    <script th:src="@{/static/backstage/js/jquery-2.1.1.js}"></script>
    <script th:src="@{/static/backstage/js/bootstrapmb.com.js}" type="text/javascript"></script>
</head>
<!--页面无法回退-->
<script>
    if (window.top !== window) {
        window.top.location.reload();
    }
    history.pushState(null, null, document.URL);
    window.addEventListener('popstate', function () {
        history.pushState(null, null, document.URL);
    });
</script>
<body>
<div class="nav">
    <div class="nav-top">
        <div id="mini" style="border-bottom:1px solid rgba(255,255,255,.1)"><img src="images/mini.png"></div>
    </div>
    <ul>
        <li class="nav-item">
            <a href="javascript:;"><i class="my-icon nav-icon icon_17"></i><span>关于网站</span><i
                    class="my-icon nav-more"></i></a>
            <ul>
                <li><a data-src="/backstage/timeLine" th:id="'pageConfig'"><span>网站信息</span></a></li>
            </ul>
        </li>
        <li class="nav-item">
            <a href="javascript:;"><i class="my-icon nav-icon icon_4"></i><span>文章管理</span><i
                    class="my-icon nav-more"></i></a>
            <ul>
                <li><a data-src="/backstage/queryArticleList/1" th:id="'articleList'"><span>博文列表</span></a></li>
                <li><a data-src="/backstage/addArticle" th:id="'addArticle'"><span>添加博文</span></a></li>
                <li><a data-src="/backstage/commentManage/1" th:id="'commentList'"><span>留言管理</span></a></li>
            </ul>
        </li>
        <li class="nav-item">
            <a href="javascript:;"><i class="my-icon nav-icon icon_3"></i><span>分类管理</span><i
                    class="my-icon nav-more"></i></a>
            <ul>
                <li><a data-src="/backstage/queryCategoryList/1" th:id="'categoryList'"><span>分类列表</span></a></li>
            </ul>
        </li>
        <li class="nav-item">
            <a href="javascript:;"><i class="my-icon nav-icon icon_2"></i><span>标签管理</span><i
                    class="my-icon nav-more"></i></a>
            <ul>
                <li><a data-src="/backstage/queryTagList/1" th:id="'tagList'"><span>标签列表</span></a></li>
            </ul>
        </li>
        <li class="nav-item">
            <a href="javascript:;"><i class="my-icon nav-icon icon_7"></i><span>个人信息</span><i
                    class="my-icon nav-more"></i></a>
            <ul>
                <li><a data-src="/backstage/selectUser" th:id="'personalInformation'"><span>查看信息</span></a></li>
            </ul>
        </li>
        <li class="nav-item">
            <a href="javascript:;" th:id="'Logout'"><i class="my-icon nav-icon icon_9"></i><span>退出登录</span></a>
        </li>
    </ul>
</div>
<div style="height: 1%;width: 100%;"></div>
<!--用于引入其他的页面-->
<div style="height: 700px;width: 72%;margin-left: 16%;" th:id="'content'">
    <p style="display: block;font-size: 4em;text-align: center;font-family: STHeiti;font-weight: inherit;line-height: 600px;margin: auto">
        WELCOME&emsp;BACK !</p>
    <iframe src="" style="height: 100%;width: 100%;border: none;display: none;" th:id="'replaceArea'"></iframe>
</div>
</body>
<script th:src="@{/static/backstage/js/layui.js}"></script>
<script type="text/javascript">
    layer.ready(function () {
        // 可均衡获取 0 到 9 的随机整数。
        var random = Math.floor(Math.random() * 10);
        switch (random) {
            case 0:
                layer.msg('若非群玉山头见，会向瑶台月下逢。');
                break;
            case 1:
                layer.msg('只缘感君一回顾，使我思君朝与暮。');
                break;
            case 2:
                layer.msg('正是江南好风景，落花时节又逢君。');
                break;
            case 3:
                layer.msg('与君初相识，犹如故人归。');
                break;
            case 4:
                layer.msg('相逢意气为君饮，系马高楼垂柳边。');
                break;
            case 5:
                layer.msg('我醉君复乐，陶然共忘机。');
                break;
            case 6:
                layer.msg('从别后，忆相逢。几回魂梦与君同。');
                break;
            case 7:
                layer.msg('柔情似水，佳期如梦，忍顾鹊桥归路。');
                break;
            case 8:
                layer.msg('相逢不语，一朵芙蓉著秋雨。');
                break;
            case 9:
                layer.msg('邂逅相遇，适我愿兮。');
                break;
        }
    });
    //页面切换测试
    $(".nav-item ul li a").click(function () {
        //执行自定义方法
        judgment();
        //加载0.5秒
        layer.load(1, {time: 0.4*1000});
        //引入界面
        var address = $(this).attr("data-src");
        setTimeout(function () {
            $("#replaceArea").attr("src", address);
        },350)
    })
    //禁止页面后退
    $(function () {
        history.pushState(null, null, document.URL);
        window.addEventListener('popstate', function () {
            history.pushState(null, null, document.URL);
        });
    })
    // 登出
    $("#Logout").click(function () {
        layer.confirm('确认退出吗？', {
            btn: ['确认', '取消'] //按钮
        }, function () {
            $.get(
                "/Admin/logout",
                function (re) {
                    //提示消息
                    layer.msg(re);
                    //重新加载页面
                    setTimeout(function () {
                        window.location.reload();
                    }, 1000)
                }
            )
        }, function () {
        })
    })

    function judgment() {
        if ($("#content p").css("display") == "block") {
            $("#content p").css("display", "none");
        }
        if ($("#replaceArea").css("display") == "none") {
            $("#replaceArea").css("display", "block");
        }
    }
</script>
</html>